	<script type="text/javascript" src="http://www.google.com/jsapi"></script>
	<script type="text/javascript">
	google.load("language", "1");
	google.setOnLoadCallback(init);
	
	
	
	function init()
	{
		var src = document.getElementById('src');
		var dst = document.getElementById('dst');
		var i=0;
		for (l in google.language.Languages)
		{
			var lng = l.toLowerCase();
			var lngCode = google.language.Languages[l];
			if (google.language.isTranslatable(lngCode))
			{
				src.options.add(new Option(lng, lngCode));
				dst.options.add(new Option(lng, lngCode));
			}
		}
		submitChange();
	}
	
	
	
	 function submitChange()
	 {
		 var value = document.getElementById('source').value;
		 var src = document.getElementById('src').value;
		 var dest = document.getElementById('dst').value;
		 google.language.translate(value, src, dest, translateResult);
		 return false;
	 }
	 
	 
	 
	 function translateResult(result)
	 {
		 var resultBody = document.getElementById("results_body");

		 if (result.translation)
		 {
		 	resultBody.innerHTML = result.translation;
		 }
		 else
		 {
		 	resultBody.innerHTML = '<span style="color:red">Error Translating</span>';
		 }
	 }
	 </script>
	
	<div id="main">
		<form class="query-box" onsubmit="return submitChange();">
			<input class="query-input" id="source" type="text"
			autocomplete="off" value="hello world"/>
			<select name="src" id="src"></select>
			>>
			<select name="dst" id="dst"></select>
			<input class="button" type="submit" value="Translate"/>
		</form>
	</div>
	
	<div id="results">
		<div id="results_title">Translation:</div>
		<hr/>
		<div id="results_body"></div>
	</div>
	
	
